/*                                                                      */
/* Normal transformation style sheet                                    */
/* (C) Copyright 2011 Yamauchi Hitoshi                                  */
/* Using Tangle by Bret Victor                                          */
/*                                                                      */

html {
}

body {
  background: #eee0c7;
  font: 14px "Lato", "Helvetica", "Arial", sans-serif;
  color: #553f19;
  width: 100%;
  margin-top:30px;
  margin-left:30px;
}

.NormalTransformCanvasArea {
    position:relative;
    width:500px;
    /* height:15; */
}

.TranslationCanvasArea {
    position:relative;
    width:250px;
    float: left;
    /* height:15; */
}

.RotationCanvasArea {
    position:relative;
    width:250px;
    float: left
    /* height:15; */
}

.ScaleCanvasArea {
    position:relative;
    width:250px;
    float: left
    /* height:15; */
}


/* scale matrix
.scaleMatrix {
    position: absolute;
    left:350px;
    top:4px;
    width:86px;
    height:50px;
}
*/

/* matrix's label: Scaling
.matrixLabelScaling {
    position:absolute;
    font: 16px "Times New Roman", "Times", serif;
    color: #000;
    background-color:#fff0;
    text-align:center;
    vertical-align:middle;
    display:block;
    left:350px;
    top:56px;
    width:86px;
    height:24px;
}
*/

/* rotate matrix
.rotateMatrix {
    position: absolute;
    left:440px;
    top:4px;
    width:204px;
    height:50px;
}

/* matrix's label: Rotation */
.matrixLabelRotation {
    position:absolute;
    font: 16px "Times New Roman", "Times", serif;
    color: #000;
    background-color:#fff0;
    text-align:center;
    vertical-align:middle;
    display:block;
    left:440px;
    top:56px;
    width:204px;
    height:24px;
}
*/

/* point columen vector
.pointColumnVector {
    position: absolute;
    left:647px;
    top:4px;
    width:50px;
    height:50px;
}
*/

/* matrix's label: Position
.matrixLabelPosition {
    position:absolute;
    font: 16px "Times New Roman", "Times", serif;
    color: #000;
    background-color:#fff0;
    text-align:center;
    display:block;
    left:647px;
    top:56px;
    width:50px;
    height:24px;
}
*/

/* operator +
.operatorPlus {
    position: absolute;
    left:700px;
    top:4px;
    width: 15px;
    height:50px;
}
*/

/* translate vector
.translationColumnVector {
    position: absolute;
    left:719px;
    top:4px;
    width: 50px;
    height:50px;
}
 */

/* matrix's label: Translation
.matrixLabelTranslation {
    position:absolute;
    font: 16px "Times New Roman", "Times", serif;
    color: #000;
    background-color:#fff0;
    text-align:center;
    display:block;
    left:719px;
    top:56px;
    width: 50px;
    height:50px;
}
 */

/* matrix's each coefficient
.matrixCoef {
    position:absolute;
    font: 16px "Times New Roman", "Times", serif;
    color: #000;
    background-color:#fff0;
    text-align:center;
    display:block;
}
*/


/* matrix's paren */
/* .matrixParen { */
/*     position:absolute; */
/*     font: 60px "Times New Roman", "Times", serif; */
/*     color: #000; */
/*     background-color:#fff0; */
/*     text-align:center; */
/*     display:block; */
/* } */
